<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../../css/mui.min.css" rel="stylesheet" />
    <link href="../../css/style.css" rel="stylesheet" />
  </head>

  <body>
    <header class="mui-bar mui-bar-nav">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
      <a class="mui-icon mui-icon-plus mui-pull-right" v-on="tap:goTo({url:'./supplier_form.html',id:'supplier_form'},{name:'供应商'})"></a>
      <h1 class="mui-center mui-title">供应商</h1>
    </header>
    <div class="mui-content">
      <div class="mui-content">
        <div id='list' class="mui-group-list">
          <div class="mui-group-list-search mui-input-row mui-search">
            <input v-model='searchQuery' lazy type="search" class="mui-input-clear mui-input-speech" placeholder="搜索供应商">
          </div>
          <ul class="mui-table-view">
            <li v-repeat="item:list
              | filterBy searchQuery " class="mui-table-view-cell mui-media">
              <div class="mui-slider-handle">
                <div class="mui-navigate-right" v-on="tap:goTo(formWebView,item)">
                  {{item.name}}
                  <h5>{{item.text}} {{item.address.city+' '+item.address.street}}</h5>
                </div>
              </div>
              <div class="mui-slider-left mui-disabled">
                <a class="mui-btn mui-btn-grey mui-icon mui-icon-person"></a>
                <a class="mui-btn mui-btn-yellow mui-icon mui-icon-phone" href="tel:10086"></a>
                <a class="mui-btn mui-btn-red mui-icon mui-icon-email"></a>
              </div>
              <div class="mui-slider-right mui-disabled">
                <a v-on="tap:deleteItem(null,item)" class="mui-btn mui-btn-red mui-icon mui-icon-trash"></a>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <script src="../../js/mui.min.js"></script>
    <script src="../../js/vue.min.js"></script>
    <script src="../../app/vue-html5.js"></script>
    <script type="text/javascript" charset="utf-8">
      var time0 = Date.now();
      (function($, window, document, Vue, vm) {
        window.vm = vm = new Vue.PageVm({
          el: 'body',
          name: 'page supplier_list',
          model: 'Suppliers',
          data: function() {
            return {
              formWebView: {
                id: 'supplier_form',
                url: './supplier_form.html'
              },
            }
          },
          created: function() {
            this.loadList();
          },
          plusReady: function() {
            Vue.preload({}, this.formWebView);
          },
          methods: {},
          mixins: [Vue.mixins.ajax, Vue.mixins.list]
        });
      })(mui, window, document, Vue, window.vm = {});
    </script>
  </body>

</html>